<template>
    <el-select v-model="agentList"
               multiple
               :multiple-limit="limit"
               filterable
               clearable size="large"
               default-first-option
               @change="handleOptionClick"
               placeholder="--代理商--">
        <el-option
                v-for="items in restaurants"
                :key="items.id" :label="items.name" :value="items.id" >
        </el-option>
    </el-select>


</template>
<script>
    export default{
        props:{
            // 接收一个由父级组件传递过来的值
            agentids:Array,
        },
        data(){
            return {
                limit:2,
                restaurants: [],
            }
        },
        computed: {
            agentList:{
                get(){
                    return this.agentids
                },
                set(){

                }
            }
        },
        methods: {
            handleOptionClick(val){
                this.$emit('listenToChildEvent',val)
            },
            loadAll() {
                this.$http.get('/server/agent/select',{headers: {isCancel: true}})
                .then((res) => {
                    const datas = res.data
                    this.$set(this.$data, 'restaurants', datas.data)
                    if(this.restaurants.length ==1){
                        this.agentList.push(this.restaurants[0].id)
                    }

                }, (res) => {

                })
            },
        },
        mounted() {
            this.loadAll()
        }
    }
</script>
